<template>
	<view class="">
		<view class="indexHeaBox">
			<view class="leftImg" @click="open2">
				<image v-if="$i18n.locale == 'ft'" src="../../static/img/zh.png" alt=""></image>
				<image v-if="$i18n.locale == 'en'" src="../../static/img/en.png" alt=""></image>
				<image v-if="$i18n.locale == 'jp'" src="../../static/img/rb.png" alt=""></image>
				<image v-if="$i18n.locale == 'ko'" src="../../static/img/hg.png" alt=""></image>
				<image v-if="$i18n.locale == 'zh'" src="../../static/img/zh.png" alt=""></image>
				<p v-if="$i18n.locale == 'ft'">港澳繁體</p>
				<p v-if="$i18n.locale == 'en'">English</p>
				<p v-if="$i18n.locale == 'jp'">にほんご</p>
				<p v-if="$i18n.locale == 'ko'">한국어</p>
				<p v-if="$i18n.locale == 'zh'">中文简体</p>
			</view>
			<view class="mask2" v-if="show2">
				<view @click="lang('en')">
					<img src="../../static/img/en.png" alt="">
					<text>English</text>
				</view>
				<view @click="lang('ft')">
					<img src="../../static/img/zh.png" alt="">
					<text>港澳繁體</text>
				</view>
				<view @click="lang('zh')">
					<img src="../../static/img/zh.png" alt="">
					<text>中文简体</text>
				</view>
				<view @click="lang('jp')">
					<img src="../../static/img/rb.png" alt="">
					<text>にほんご</text>
				</view>
				<view @click="lang('ko')">
					<img src="../../static/img/hg.png" alt="">
					<text>한국어</text>
				</view>
			</view>
			<view class="rightImg">
				<!-- <image @click="goPage('../recentNews/index')" src="../../static/images/41.png" mode=""></image>
				<view class="rightImgLine"></view> -->
				<image @click="islogin()" src="../../static/images/23.png" mode=""></image>
				<view v-if="info.email" class="rightImgName">
					{{info ? info.email : $t('login.title35')}}
				</view>
				<image @click="loginouts()" class="logout" src="../../static/images/logout.png" mode=""></image>
			</view>
			<view class="sjhsuid">
				UID：{{info ? info.uid : ""}}
			</view>
		</view>
		<view class="indexNav">
			<view class="indexNavIt" v-for="(item,index) in navList" :key="index" @click="goPage(item.path)">
				<image :src="item.img" mode=""></image>
				{{item.title}}
			</view>
		</view>
		<view class="linehjghj">
			<view class="lineLeft">

			</view>
		</view>
		<view class="tongjiBox">
			<view class="tongjiBoxTitle">
				{{$t('indexTitle.title1')}}
			</view>
			<view class="tongjiNav">
				<div class="conNavOneItdada">
					<div class="conNavOneItRiButs">
						<u-button type="primary" :custom-style="customStyleOne" size="mini"
							@click="gocunkuan()">{{$t('indexTitle.title3')}}</u-button>
						<u-button type="primary" :custom-style="customStyleThree" size="mini"
							@click="gozhuanzhang(0)">{{$t('indexTitle.title4')}}</u-button>
					</div>
					<view class="conNavOneItRiBut" @click="gorecord(1)">
						<img src="../../static/images/55.png" alt="">
						<div class="conNavOneItRi">
							<p>{{$t('allocation.title10')}}</p>
							<p>{{balance[0] || '0.00'}} <br />USD</p>
						</div>
					</view>
				</div>
				<div class="conNavOneItdada" style="background-color: #ffca93;">
					<div class="conNavOneItRiButs">
						<u-button type="primary" :custom-style="customStyleOne" size="mini"
							@click="gotixian(0)">{{$t('indexTitle.title4s')}}</u-button>
						<u-button type="primary" :custom-style="customStyleThree" size="mini"
							@click="gozhuanzhang(1)">{{$t('indexTitle.title4')}}</u-button>
					</div>
					<view class="conNavOneItRiBut" @click="gorecord(2)">
						<img src="../../static/images/55.png" alt="">
						<div class="conNavOneItRi">
							<p>{{$t('allocation.title11')}}</p>
							<p>{{balance[1] || '0.00'}} <br />USD</p>
						</div>
					</view>
				</div>
				<div class="conNavOneItdada" style="background-color: #8ec8fa;">
					<div class="conNavOneItRiButs">
						<u-button type="primary" :custom-style="customStyleOne" size="mini"
							@click="gotixian(1)">{{$t('indexTitle.title4s')}}</u-button>
						<u-button type="primary" :custom-style="customStyleThree" size="mini"
							@click="gozhuanzhang(2)">{{$t('indexTitle.title4')}}</u-button>
					</div>
					<view class="conNavOneItRiBut" @click="gorecord(3)">
						<img src="../../static/images/55.png" alt="">
						<div class="conNavOneItRi">
							<p>{{$t('allocation.title12')}}</p>
							<p>{{balance[2] || '0.00'}} <br />USD</p>
						</div>
					</view>
				</div>
				<!-- <div class="conNavOneItdada" style="background-color: #277af5;">
					<img src="../../static/images/55.png" alt="">
					<div class="conNavOneItRi">
						<p>{{$t('allocation.title13')}}</p>
						<p>{{balance[3] || '0.00'}} USD</p>
						<div class="conNavOneItRiBut">
							<u-button type="primary" :custom-style="customStyleThree" size="mini" style="width: 96rpx;"
								@click="gozhuanzhang(3)">{{$t('indexTitle.title4')}}</u-button>
						</div>
					</div>
				</div> -->
			</view>
		</view>
		<view class="conLineBox"></view>
		<!-- <div class="conTitOneTit">
			· {{$t('recharge.title')}} ·
		</div> -->
		<div class="conListBox">
			<div class="conListBoxIt">
				<div class="rechargetitle">
					<view></view>
					{{$t('recharge.title15')}}:
				</div>
				<div class="withdrawlist">
					<div class="rechargeitem" v-if="type == 0" :class="type == 0 ? 'active' : ''" @click="changetype(0)">
						<image class="icons" src="../../static/images/55.png" mode=""></image>
						<div class="texts">
							<div class="name">{{$t('allocation.title11')}}</div>
							<div class="num">{{balance[1] || '0.00'}} USD</div>
						</div>
					</div>
					<div class="rechargeitem" v-if="type == 1" :class="type == 1 ? 'active' : ''" @click="changetype(1)">
						<image class="icons" src="../../static/images/55.png" mode=""></image>
						<div class="texts">
							<div class="name">{{$t('allocation.title12')}}</div>
							<div class="num">{{balance[2] || '0.00'}} USD</div>
						</div>
					</div>
				</div>
				<div class="rechargetitle" style="margin-top: 30rpx;">
					{{$t('recharge.title19')}}:
				</div>
				<div class="withtext" v-if="info.address">{{info.address}}</div>
				<div class="withtext" v-else @click="bindaddr = true">{{$t('recharge.title20')}}</div>
				<div class="rechargetitle">
					{{$t('recharge.title21')}}:
				</div>
				<div class="withinput">
					<input type="text" placeholder="0.00" v-model="num" @input="jisuan">
					<div class="text1">USD</div>
				</div>
				<div class="rechargetitle">
					{{$t('recharge.title39')}}:
				</div>
				<div class="withinput">
					<input type="password" :placeholder="$t('recharge.title40')" v-model="possword">
				</div>
				<div class="rechargetitle">
					{{$t('recharge.title22')}}:
				</div>
				<div class="withtext1">{{shouxufeinum}} USD</div>
				<div class="rechargetitle">
					{{$t('recharge.title23')}}:
				</div>
				<div class="withtext1">{{shijijine}} USD</div>
				<div class="reline"></div>
				<div class="rechargetitle">
					<view></view>
					{{$t('recharge.title4')}}:
				</div>
				<div class="retext">{{$t('recharge.title17')}}</div>
				<div class="retext">{{$t('recharge.title18')}}{{shouxufei}}{{$t('recharge.title18s')}}</div>
				<div class="queren" @click="submit">{{$t('login.title25')}}</div>
			</div>
		</div>
		<div class="conTitOneTit">
			· {{$t('recharge.title16')}} ·
		</div>
		<div class="conListBox">
			<div class="conListBoxIts">
				<div class="retableheader">
					<view>{{$t('recharge.title9')}}</view>
					<view>{{$t('recharge.title10')}}</view>
					<!-- <view>{{$t('recharge.title11')}}</view> -->
					<view>{{$t('recharge.title12')}}</view>
					<!-- <view>{{$t('recharge.title27')}}</view> -->
					<view>{{$t('recharge.title13')}}</view>
				</div>
				<div class="retableitem" v-if="list.length > 0" v-for="(item,index) in list" :key="index">
					<view v-if="item.notes != ''" @click="copys(item.notes)">{{item.notes.substring(0,3)}}****{{item.notes.substr(-3)}}</view>
					<view v-else></view>
					<view>{{item.created_at}}</view>
					<!-- <view>TRC20</view> -->
					<view>{{item.number}}</view>
					<view v-if="item.status == 4">{{$t('first.title108')}}</view>
					<view v-if="item.status == 1">{{$t('recharge.title56')}}</view>
					<view v-if="item.status == 5">{{$t('recharge.title57')}}</view>
				</div>
				<view style="width: 100%;text-align: center;margin-top: 30rpx;" v-if="list.length == 0">
					<image src="../../static/img/empty.png" style="width: 50px;height: 50px;"></image>
					<p> {{$t('first.title44')}}</p>
				</view>
				<view class="fenye" v-if="list.length > 0">
					<view :class="pages > 1 ? 'fyactive':''" @click="prevpage">{{$t('indexTitle.title45')}}</view>
					<view class="fycon">{{pages}}/{{totalpage}}</view>
					<view :class="pages < totalpage ? 'fyactive':''" @click="nextpage">{{$t('indexTitle.title46')}}</view>
				</view>
			</div>
		</div>
		<div class="conTitOneTit">
			<!-- · {{$t('activityTitle.title5')}} · -->
		</div>
		<div class="tishiBox">
			<div class="tishiBoxIt">
				<!-- <image src="../../static/images/59.jpg" alt=""></image> -->
				<div class="tishiBoxItText">
					<div class="tishiBoxItTextTit">
						<div class=""></div>
						<p>{{$t('activityTitle.title6')}}</p>
					</div>
					<div class="tishiBoxItTextCon">
						{{$t('activityTitle.title7')}}
					</div>
				</div>
			</div>
			<div class="tishiBoxIt">
				<div class="tishiBoxItText">
					<div class="tishiBoxItTextTit">
						<div class=""></div>
						<p>{{$t('activityTitle.title8')}}</p>
					</div>
					<div class="tishiBoxItTextCon">
						{{$t('activityTitle.title9')}}
					</div>
				</div>
				<!-- <image src="../../static/images/60.jpg" alt=""></image> -->
			</div>
		</div>
		<div class="conSix">
			<p>{{$t('indexTitle.title24')}}</p>
			<!-- <div class="conSixText">
				<p>{{$t('indexTitle.title25')}}</p>
				<p>{{$t('indexTitle.title26')}}</p>
			</div> -->
		</div>
		<!-- <p class="buttomBoxbut">{{$t('indexTitle.title27')}}</p> -->
		<!-- <div class="bottomTextBox">
			{{$t('indexTitle.title28')}}
		</div> -->
		<view class="notice" v-if="loginout">
			<view class="loginoutbox">
				<view class="lbtitle">{{$t('login.title36')}}</view>
				<view class="lbtitle1">{{$t('login.title37')}}</view>
				<view class="lbbtns">
					<view class="lbbtn1" @click="loginout = false">{{$t('login.title38')}}</view>
					<view class="lbbtn2" @click="logout()">{{$t('login.title39')}}</view>
				</view>
			</view>
		</view>
		<view class="notice" v-if="bindaddr">
			<view class="babox">
				<image class="close" @click="bindaddr = false" src="../../static/images/close.png" mode=""></image>
				<image class="baicon" src="" mode=""></image>
				<view class="batitle">TRC20 {{$t('recharge.title43')}}</view>
				<view class="bacon">
					<view class="batext">{{$t('recharge.title44')}}</view>
					<input class="bainput" type="text" :placeholder="$t('recharge.title45')" v-model="addr">
					<div class="batext">
						<!-- {{$t('recharge.title27s')}} -->
						{{$t('recharge.title39')}}
					</div>
					<!-- <div class="batext1">{{$t('recharge.title29')}}</div> -->
					<div class="withinput" style="padding-right: 0;overflow: hidden;">
						<input type="password" :placeholder="$t('recharge.title40')" v-model="psd">
						<!-- <input type="password" :placeholder="$t('recharge.title28')" v-model="psd"> -->
						<!-- <div class="batext2" v-if="fasong" @click="sendmsg">{{$t('recharge.title30')}}</div>
						<view class="batext2" v-if="!fasong">{{time}}s</view> -->
					</div>
					<view class="batext">{{$t('allocation.title22')}}</view>
					<view class="batext1" style="margin-top: 10rpx;">{{$t('recharge.title46')}}</view>
					<view class="babtn" @click="submitaddr()">{{$t('recharge.title47')}}</view>
				</view>
			</view>
		</view>
		<view class="kefu" @click="gokefu">
			<image src="../../static/images/telegram.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	import {
		domains
	} from '../../config/domain.js'
	export default {
		components: {},
		data() {
			return {
				customStyleOne: {
					background: '#fdd02e !important',
					color: '#fff !important',
					border: 'none !important',
					fontSize: '12px !important',
					marginBottom: '5px !important',
				},
				customStyleTow: {
					background: '#5fb4fb !important',
					color: '#fff !important',
					fontSize: '12px !important',
					border: 'none !important',
					marginBottom: '5px !important',
				},
				customStyleThree: {
					background: '#5fb4fb !important',
					color: '#fff !important',
					fontSize: '12px !important',
					border: 'none !important',
					marginBottom: '5px !important',
					marginLeft: '5px !important',
				},
				navList: [{
						'title': this.$t('indexTitle.title29'),
						"img": '../../static/images/3.png',
						"path": '../index/index'
					},
					{
						'title': this.$t('indexTitle.title30'),
						"img": '../../static/images/19.png',
						"path": '../activity/index'
					},
					{
						'title': this.$t('indexTitle.title31'),
						"img": '../../static/images/17.png',
						"path": '../configuration/index'
					},
					{
						'title': this.$t('indexTitle.title33'),
						"img": '../../static/images/15.png',
						"path": '../recharge/record'
					},
					{
						'title': this.$t('indexTitle.title34'),
						"img": '../../static/images/13.png',
						"path": '../vipStructure/vipStructure'
					},
					{
						'title': this.$t('indexTitle.title36'),
						"img": '../../static/images/9.png',
						"path": '../myPlatform/downloadPlatform'
					},
					{
						'title': this.$t('indexTitle.title32'),
						"img": '../../static/images/5.png',
						"path": '../userProfile/index'
					},
					{
						'title': this.$t('indexTitle.title35'),
						"img": '../../static/images/7.png',
						"path": '../recentNews/index'
					},
					// {
					// 	'title': this.$t('indexTitle.title37'),
					// 	"img": '../../static/images/11.png',
					// 	"path": '../ranking/index'
					// },
				],
				show2: false,
				type: 0,
				info: [],
				loginout: false,
				balance: [],
				bindaddr: false,
				num: '',
				possword: '',
				addr: '',
				psd: '',
				time:60,
				fasong: true,
				kefuurl:'',
				shouxufei:'',
				shouxufeinum:0,
				shijijine:0,
				
				pages:1,
				list:[],
				totalpage:1,
			}
		},
		onLoad(e) {
			this.getinfo()
			if (e.type) {
				this.type = e.type
			}
			this.getkefu()
			this.getshouxufei()
		},
		onShow() {
			this.getbalance()
			this.getlist()
		},
		onReady() {},
		methods: {
			jisuan(){
				let shouxu = Number(this.shouxufei) / 100
				this.shouxufeinum = Number(this.num) * shouxu
				this.shijijine = Number(this.num) - this.shouxufeinum
			},
			getshouxufei(){
				let url = domains + 'api/default/setting?key=draw_fee';
				let mytype = 'get';
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							this.shouxufei = res.data.data
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			getkefu(){
				let url = domains + 'api/default/setting?key=sign_kefu';
				let mytype = 'get';
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							this.kefuurl = res.data.data
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			gokefu(){
				window.open(this.kefuurl)
			},
			getbalance() {
				let url = domains + 'api/balance';
				let mytype = 'get';
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							this.balance = res.data.data
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			sendmsg() {
				let that = this;
				let url = domains + 'api/notify/send_email_n';
				let data = {
					to: that.info.email
				}
				let mytype = 'post';
				
				// 没有接口 替换接口
				return false
				
				uni.request({
					url,
					method: mytype,
					data,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang')
					},
					success: res => {
						if (res.data.code == 0) {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
							that.fasong = false
							let timer = setInterval(function(){
								if(that.time == 0){
									that.fasong = true
									that.time = 60
									clearInterval(timer)
								}else{
									that.time--
								}
							},1000)
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			submitaddr() {
				if (this.addr == '') {
					uni.showToast({ //提示
						icon: 'none',
						title: this.$t('recharge.title45')
					})
					return false
				}
				if (this.psd == '') {
					uni.showToast({ //提示
						icon: 'none',
						title: this.$t('recharge.title28')
					})
					return false
				}
				let url = domains + 'api/new_address';
				let mytype = 'post';
				let data = {
					address: this.addr,
					password: this.psd
				}
				uni.request({
					url,
					method: mytype,
					data,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							this.bindaddr = false
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
							this.getinfo()
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					}
				});
			},
			getinfo() {
				let url = domains + 'api/user/info';
				let mytype = 'post';
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							this.info = res.data.data
							uni.setStorage({
								key: 'info',
								data: res.data.data
							})
						} else if (res.data.code == 999) {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
							setTimeout(function() {
								uni.navigateTo({
									url: '/pages/login/newlogin'
								})
							}, 1500)
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			submit() {
				if (this.info.address == null) {
					this.bindaddr = true
					return false
				}
				if (this.num == '') {
					uni.showToast({ //提示
						icon: 'none',
						title: this.$t('recharge.title48')
					})
					return false
				}
				if (this.possword == '') {
					uni.showToast({ //提示
						icon: 'none',
						title: this.$t('recharge.title40')
					})
					return false
				}
				let url = domains + 'api/new_draw';
				let mytype = 'post';
				let data = {
					number: this.num,
					currency_id: this.type,
					password: this.possword
				}
				uni.request({
					url,
					method: mytype,
					data,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'authorization': uni.getStorageSync('tokenNum')
					},
					success: res => {
						if (res.data.code == 0) {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
							this.num = ''
							this.getbalance()
							this.pages = 1
							this.getlist()
						} else {
							uni.showToast({ //提示
								icon: 'none',
								title: res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					}
				});
			},
			getlist(){
				let url = domains + 'api/account_log/outlogdetail?page='+this.pages;
				let mytype = 'get';
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded' ,//自定义请求头信息
						'Lang':uni.getStorageSync('lang'),
						'authorization':uni.getStorageSync('tokenNum')
					},
					success: res => {
						if(res.data.code == 0){
							this.list = res.data.data.data
							this.totalpage = res.data.data.last_page
						}else{
							uni.showToast({//提示
								icon:'none',
								title:res.data.msg
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			prevpage(){
				if(this.pages > 1){
					this.pages--
					this.getlist()
				}
			},
			nextpage(){
				if(this.pages < this.totalpage){
					this.pages++
					this.getlist()
				}
			},
			copys(value){
				uni.setClipboardData({
					data:value,//要被复制的内容
					success:()=>{//复制成功的回调函数
						uni.showToast({//提示
							icon:'none',
							title:this.$t('first.title115')
						})
					}
				});
			},
			islogin() {
				if (this.info) {
					// this.loginout = true;
				} else {
					uni.showToast({ //提示
						icon: 'none',
						title: this.$t('login.title35')
					})
					setTimeout(function() {
						uni.navigateTo({
							url: '/pages/login/newlogin'
						})
					}, 1500)
				}
			},
			loginouts(){
				this.loginout = true;
			},
			logout() {
				uni.removeStorage({
					key: 'token'
				})
				uni.removeStorage({
					key: 'tokenNum'
				})
				uni.removeStorage({
					key: 'info'
				})
				uni.showToast({ //提示
					icon: 'none',
					title: this.$t('login.title40')
				})
				setTimeout(function() {
					uni.navigateTo({
						url: '/pages/login/newlogin'
					})
				}, 1500)
				this.loginout = false
			},
			changetype(e) {
				this.type = e
			},
			gorecord(e){
				uni.navigateTo({
					url: '/pages/recharge/record?tab=' + e
				})
			},
			gozhuanzhang(e) {
				uni.navigateTo({
					url: '/pages/recharge/transfer?type=' + e
				})
			},
			gotixian(e) {
				uni.navigateTo({
					url: '/pages/recharge/withdraw?type=' + e
				})
			},
			gocunkuan() {
				uni.navigateTo({
					url: '/pages/recharge/recharge'
				})
			},
			open2() {
				this.show2 = !this.show2
			},
			lang(e) {
				this.$i18n.locale = e;
				localStorage.setItem('lang', e);
				this.show2 = false;
				this.navList = [{
						'title': this.$t('indexTitle.title29'),
						"img": '../../static/images/3.png',
						"path": '../index/index'
					},
					{
						'title': this.$t('indexTitle.title30'),
						"img": '../../static/images/19.png',
						"path": '../activity/index'
					},
					{
						'title': this.$t('indexTitle.title31'),
						"img": '../../static/images/17.png',
						"path": '../configuration/index'
					},
					{
						'title': this.$t('indexTitle.title33'),
						"img": '../../static/images/15.png',
						"path": '../recharge/record'
					},
					{
						'title': this.$t('indexTitle.title34'),
						"img": '../../static/images/13.png',
						"path": '../vipStructure/vipStructure'
					},
					{
						'title': this.$t('indexTitle.title36'),
						"img": '../../static/images/9.png',
						"path": '../myPlatform/downloadPlatform'
					},
					{
						'title': this.$t('indexTitle.title32'),
						"img": '../../static/images/5.png',
						"path": '../userProfile/index'
					},
					{
						'title': this.$t('indexTitle.title35'),
						"img": '../../static/images/7.png',
						"path": '../recentNews/index'
					},
				]
				this.$emit("toTime", "我来自子组件")
			},
			goPage(path) {
				uni.navigateTo({
					url: path
				})
			},
			switchLang() {
				uni.navigateTo({
					url: ''
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	* {
		box-sizing: border-box;
	}

	.conTitOneTit {
		width: 100%;
		text-align: center;
		font-size: 16px;
		color: #000;
		margin: 20px 0px 10px;
	}
.sjhsuid{
		position: absolute;
		top: 42px;
		right: 50px;
	}
	.indexHeaBox {
		width: 100%;
		height: 180px;
		background-image: url('../../static/images/57.jpg');
		background-repeat: no-repeat;
		background-size: 100% 100%;
		display: flex;
		font-size: 12px;
		color: #fff;
		justify-content: space-between;
		padding: 10px 15px;
	}

	.leftImg {
		height: 40px;
		display: flex;
		align-items: center;

		image {
			width: 25px;
			height: 25px;
			margin-right: 5px;
		}
	}

	.rightImg {
		display: flex;
		height: 40px;
		align-items: center;

		image:first-child {
			width: 16px;
			height: 18px;
			margin-right: 5px;
		}
		
		image:last-child {
			width: 18px;
			height: 18px;
		}
		
		.logout{
			width: 40rpx !important;
			margin-left: 10rpx;
		}

		.rightImgLine {
			width: 1px;
			background-color: #fff;
			height: 20px;
			margin: 0px 5px;
		}

		.rightImgName {
			padding: 2px 5px;
			background-color: #6aa3ea;
			color: #000;
		}
	}

	.indexNav {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin: 15px 0 10px;

		.indexNavIt {
			width: 25%;
			display: flex;
			align-items: center;
			flex-direction: column;
			font-size: 14px;
			color: #333;
			margin-bottom: 10px;
			text-align: center;
		
			image {
				width: 20px;
				height: 18px;
				margin-bottom: 10px;
			}
		}
		
		.indexNavIt:nth-child(5) image {
			width: 22px;
		}

		.indexNavIt:nth-child(9) image {
			height: 21px;
		}
	}

	.conLineBox {
		width: 100%;
		height: 7px;
		background-color: #ededed;
	}

	.conBox {
		width: 100%;
		padding: 10px 15px 20px;
		margin-top: 10px;
	}

	.conOne {
		background-color: #f1f3ff;
		border-radius: 5px;
	}

	.conSix {
		padding: 40px 20px 30px;
		margin-top: 40px;
		background-image: url('../../static/images/58.jpg');
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}

	.conSix>p:nth-child(1) {
		font-size: 13px;
		font-weight: 600;
		color: #fff;
	}

	.buttomBoxbut {
		width: 300px;
		margin: 30px auto;
		text-align: center;
		line-height: 30px;
		height: 30px;
		font-size: 14px;
		color: #fff;
		cursor: pointer;
		background-color: #fed136;
		border-radius: 30px;
	}

	.conSixText {
		margin: 20px 0px 0;
		text-align: center;
		font-size: 13px;
		color: #fff;
	}


	.conSixText p {
		margin-bottom: 10px;
	}

	.bottomTextBox {
		text-align: center;
		font-size: 12px;
		color: #333;
		margin: 10px 0;
	}

	// .conNavOne {
	// 	width: 70%;
	// 	margin: 0 auto;
	// 	padding-bottom: 10px;
	// 	display: flex;
	// 	align-items: center;
	// 	justify-content: space-between;
	// 	border-bottom: 1px solid #e5e6e9;
	// }

	// .conNavOneIt {
	// 	width: 50%;
	// 	display: flex;
	// 	align-items: center;
	// 	font-size: 13px;
	// 	color: #333;
	// }

	// .conNavOneIt image {
	// 	width: 35px;
	// 	height: 40px;
	// 	margin-right: 5px;
	// }

	// .conNavOneItRi p {
	// 	margin: 0;
	// 	font-size: 12px;
	// 	text-align: left;
	// }

	// .conNavOneItRi p:nth-child(2) {
	// 	color: #5eb7fa;
	// 	margin: 2px 0px;
	// 	font-weight: 600;
	// }

	.conNavOneItRiButs {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 0px auto 10rpx;
	}

	.butItewmBox {
		width: 28%;
	}

	.conTitTow {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.conTitTowLeft {
		display: flex;
		align-items: center;
		font-size: 14px;
		color: #333;
		font-weight: 600;
	}

	.yuanBox {
		width: 8px;
		height: 8px;
		background-color: #5eb7fa;
		border-radius: 50%;
		margin-right: 5px;
	}

	.conThreeTitle {
		width: 95%;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-bottom: 5px;
		border-bottom: 1px solid #e5e6e9;
		font-size: 14px;
		color: #333;
	}

	.conThreeTi {
		font-size: 16px;
		color: #6c83bf;
		position: relative;
	}

	.conThreeTitle p {
		margin: 4px 0;
		margin-right: 10px;
	}

	.lineBox {
		position: absolute;
		width: 60px;
		height: 2px;
		background-color: #6c83bf;
		bottom: -5px;
		left: 0;
	}

	.shujutongjiBox {
		height: 180px;
		padding: 0px 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.shujutongjiBox>image {
		width: 70px;
		height: 70px;
	}

	.lianjieBox {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 13px;
		color: #333;
		margin-top: 10px;
	}

	.lianjieBox image {
		width: 15px;
		height: 15px;
		margin-right: 5px;
	}

	.tongjiText {
		display: flex;
		width: 100%;
		justify-content: flex-end;
	}

	.tongjiTextOne {
		width: 70%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}

	.tongjiTexTit {
		display: flex;
		align-items: center;
		width: 50%;
		margin-top: 5px;
		font-size: 12px;
		color: #333;
	}

	.tongjiTexTitTow {
		display: flex;
		align-items: center;
		width: 25%;
		font-size: 12px;
		color: #333;
	}

	.tongjiTexTit p {
		margin: 0;
	}

	.tongjiTexTit span {
		color: #5eb7fa;
	}

	.lineOne {
		background-color: #eff3f6;
	}

	.lineTow {
		background-color: #2791ef;
	}

	.lineThree {
		background-color: #f8ea61;
	}

	.lineFour {
		background-color: #58c1fa;
	}

	.lineFive {
		background-color: #ae7ae2;
	}

	.conListBox {
		width: 95%;
		margin: 0 auto;
	}

	.conListBoxIt {
		width: 100%;
		background-color: #fff;
		border-radius: 2px;
		box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 5px;
		padding: 15px 20px 15px 20px;
		margin-bottom: 20px;
	}

	.conListBoxIt>p {
		width: 100%;
		color: #000;
		text-align: left;
		font-size: 15px;
		overflow: hidden;
	}

	.conListBoxItCon {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 12px;
		color: #adadad;
		margin: 10px 0;
	}

	.conListBoxItCon>div {
		display: flex;
		align-items: center;
	}

	.conListBoxItCon image {
		width: 15px;
		height: 15px;
		margin-right: 5px;
	}

	.moreBox {
		font-size: 13px;
		color: #333;
		width: 100px;
		text-align: center;
		cursor: pointer;
		height: 25px;
		line-height: 25px;
		margin-top: 20px;
		border: 1px solid #d9d9d9;
	}

	.jintuLine {
		width: 100%;
		margin: 9px auto 10px;
		height: 7px;
		border-radius: 2px;
		background-color: #eef2f5;
	}

	.jintuLineXuanzhong {
		width: 50%;
		height: 7px;
		border-radius: 2px;
		background: linear-gradient(to right, #83c6ef, #238eec);
	}



	.tongjiBox {
		width: 95%;
		margin: 0 auto;
	}

	.tongjiBoxTitle {
		font-size: 15px;
		font-weight: 600;
		margin-bottom: 10px;
	}

	.linehjghj {
		width: 15%;
		margin: 0px auto 20px;
		height: 5px;
		border-radius: 10px;
		background-color: #eaeaea;
	}

	.lineLeft {
		width: 50%;
		border-radius: 10px;
		height: 5px;
		background-color: #277af5;
	}

	.tongjiNav {
		margin: 20px 0;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}

	.conNavOneItdada {
		width: 32.5%;
		margin-bottom: 5px;
		border-radius: 10px;
		padding: 10px 8px;
		background-color: #938ced;
		font-size: 12px;
		color: #fff;
	}

	.conNavOneItdada img {
		width: 30px;
		height: 26px;
		margin-right: 5px;
	}

	.conNavOneItRi p {
		margin: 0;
		text-align: left;
	}

	.conNavOneItRi p:nth-child(2) {
		// color: #5eb7fa;
		margin: 2px 0px;
		font-weight: 600;
	}

	.conNavOneItRiBut {
		width: 100%;
		display: flex;
		align-items: center;
	}

	.mask2 {
		position: fixed;
		top: 90rpx;
		left: 30rpx;
		z-index: 99;
		background-color: #ffffff;
		border-radius: 50rpx;
		padding: 10rpx 30rpx;
		font-size: 24rpx;
	}

	.mask2 img {
		width: 44rpx;
		height: 44rpx;
		margin-right: 30rpx;
	}


	.mask2 view {
		display: flex;
		color: #000;
		align-items: center;
		margin: 20rpx;
	}

	.tishiBox {
		width: 85%;
		margin: 0px auto;
	}

	.tishiBoxIt {
		// display: flex;
		border-radius: 3px;
		// align-items: center;
		width: 100%;
		margin: 20px 0 0px;
		box-shadow: #e1e9fb 1.95px 1.95px 5px;
	}

	.tishiBoxIt image {
		width: 100%;
		height: 350px;
	}

	.tishiBoxItText {
		width: 100%;
		// height: 350px;
		background-color: #fff;
		padding: 15px 10px 20px 10px;
	}

	.tishiBoxItTextTit {
		display: flex;
		align-items: center;
		font-size: 17px;
		color: #238bdf;
		font-weight: 600;
	}

	.tishiBoxItTextTit>div {
		width: 3px;
		height: 25px;
		background-color: #238bdf;
		margin-right: 5px;
	}

	.tishiBoxItTextCon {
		// padding: 10px 0px 0px 20px;
		font-size: 14px;
		color: #333;
		margin-top: 10px;
		line-height: 30px;
		text-align: left;
	}

	.rechargetitle {
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 30rpx;
		font-size: 28rpx;
		color: #000;
		font-weight: bold;
	}

	.rechargetitle view {
		width: 14rpx;
		height: 14rpx;
		border-radius: 50%;
		background-color: #1a92ff;
		margin-right: 10rpx;
	}

	.rechargeitem {
		width: 90%;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 0 auto;
		margin-bottom: 20rpx;
		border: 2rpx solid #eaeaea;
		border-radius: 10rpx;
		padding: 20rpx 30rpx;
	}

	.rechargeitem.active {
		background-color: #5cb9ff;
	}

	.rechargeitem .icons {
		width: 60rpx;
		height: 60rpx;
		margin-right: 20rpx;
	}

	.rechargeitem .name {
		color: #fff;
		font-size: 28rpx;
		margin-bottom: 10rpx;
	}

	.num {
		color: #fff;
		font-size: 28rpx;
		font-weight: bold;
	}

	.reline {
		width: 100%;
		height: 2rpx;
		background-color: #eaeaea;
		margin: 40rpx 0;
	}

	.retext {
		width: 100%;
		padding-left: 24rpx;
		font-size: 24rpx;
		color: #000;
		line-height: 40rpx;
	}

	.conListBoxIts {
		width: 100%;
		background-color: #fff;
		border-radius: 4rpx;
		box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 5px;
		padding: 30rpx 20rpx 30rpx 20rpx;
		margin-bottom: 40rpx;
	}

	.retableheader {
		width: 100%;
		height: 80rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 2rpx solid #e7e8f0;
		margin-bottom: 30rpx;
	}

	.retableheader view {
		width: 20%;
		font-size: 24rpx;
		color: #000;
		text-align: center;
	}

	.retableheader view:nth-child(2) {
		width: 26%;
	}
	.retableheader view:nth-child(3) {
		width: 24%;
	}
	.retableheader view:nth-child(4) {
		flex: 1;
	}

	.retableitem {
		width: 100%;
		padding: 20rpx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #5cb9ff;
	}

	.retableitem:nth-child(2n) {
		background-color: #fff;
	}

	.retableitem view {
		width: 20%;
		font-size: 24rpx;
		color: #000;
		text-align: center;
	}

	.retableitem view:nth-child(2) {
		width: 26%;
	}
	.retableitem view:nth-child(3) {
		width: 24%;
	}
	.retableitem view:nth-child(4) {
		flex: 1;
	}

	.queren {
		width: 120rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		border: 2rpx solid #ddd;
		font-size: 28rpx;
		color: #000;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
		cursor: pointer;
	}

	.withtext {
		width: fit-content;
		padding: 12rpx 20rpx;
		border-radius: 50rpx;
		background-color: #5cb9ff;
		font-size: 28rpx;
		color: #fff;
		margin: 30rpx 0;
	}

	.withinput {
		width: 100%;
		height: 60rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 30rpx 0;
		border-radius: 50rpx;
		border: 2rpx solid #eaeaea;
		padding: 0 20rpx;
	}

	.withinput input {
		flex: 1;
	}

	.withinput .text1 {
		font-size: 32rpx;
		font-weight: bold;
		color: #000;
	}

	.withtext1 {
		width: 100%;
		text-align: left;
		font-size: 28rpx;
		color: #000;
		margin-bottom: 30rpx;
		padding-left: 20rpx;
	}

	.notice {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1111;
		background-color: rgba(0, 0, 0, .4);
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.loginoutbox {
		width: 80%;
		background-color: #fff;
		border-radius: 20rpx;
	}

	.lbtitle {
		width: 100%;
		height: 100rpx;
		font-size: 16px;
		line-height: 100rpx;
		text-align: center;
	}

	.lbtitle1 {
		width: 100%;
		height: 100rpx;
		font-size: 14px;
		line-height: 100rpx;
		text-align: center;
		margin-bottom: 30rpx;
	}

	.lbbtns {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 50rpx;
		margin-bottom: 40rpx;
	}

	.lbbtn1 {
		width: 140rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		border-radius: 10rpx;
		font-size: 14px;
		color: #000;
		background-color: #f0f0f0;
	}

	.lbbtn2 {
		width: 140rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		border-radius: 10rpx;
		font-size: 14px;
		color: #fff;
		background-color: #238bdf;
	}

	.babox {
		width: 88%;
		background-color: #fff;
		border-radius: 20rpx;
		position: relative;
		padding-top: 70rpx;
	}

	.close {
		width: 40rpx;
		height: 40rpx;
		position: absolute;
		top: 30rpx;
		right: 30rpx;
	}

	.baicon {
		display: block;
		margin: 0 auto;
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		margin-bottom: 30rpx;
		background-color: red;
	}

	.batitle {
		width: 100%;
		text-align: center;
		font-size: 40rpx;
		font-weight: bold;
		color: #000;
		margin-bottom: 30rpx;
	}

	.bacon {
		width: 100%;
		border-top: 8rpx solid #eaeaea;
		padding: 30rpx 50rpx;
		padding-bottom: 60rpx;
	}

	.batext {
		font-size: 30rpx;
		color: #f3b90d;
	}

	.batext1 {
		font-size: 24rpx;
		color: #000;
	}

	.bainput {
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		border: 2rpx solid #eaeaea;
		font-size: 28rpx;
		color: #000;
		border-radius: 50rpx;
		margin-top: 20rpx;
		margin-bottom: 30rpx;
		padding: 0 20rpx;
	}

	.batext2 {
		height: 60rpx;
		line-height: 60rpx;
		padding: 0 30rpx;
		background-color: #5cb9ff;
		font-size: 32rpx;
		font-weight: bold;
		color: #fff;
	}

	.babtn {
		width: 40%;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		border-radius: 50rpx;
		font-size: 30rpx;
		color: #fff;
		background-color: #5cb9ff;
		margin: 0 auto;
		margin-top: 30rpx;
	}
	.kefu{
		width: 80rpx;
		height: 80rpx;
		position: fixed;
		bottom: 15%;
		right: 20rpx;
		z-index: 1000;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		
		image{
			width: 80rpx;
			height: 80rpx;
		}
	}
	
	.fenye{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 30rpx 0;
		font-size: 28rpx;
		color: #999;
	}
	.fycon{
		color: #000;
	}
	.fyactive{
		color: #000;
	}
</style>